/* reset
------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before,
blockquote:after,
q:before, q:after { content: ''; content: none; }
/* remember to define focus styles! */
:focus { outline: 0; }
/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }
/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }

/* general

      Bkgnd: F4F4F4
      Black: #333334
      Grey: #9d9d9c
      Blue: #4d94cc
      Yellow: #fcc14e - as background color
      Yellow 40%: #fee6b8 - as highlighting
      Yellow text: #f3ad25 - as font color


------------------------------------------------------------------*/
body { background-color: #F4F4F4; color: #333334; font-family:"Trebuchet MS", Arial, Verdana; font-size: 12px; }
h1 { margin: 0 0 15px; font-size: 14px; font-weight: bold; color: #414141; }
h2 { margin: 0 0 15px; font-size: 12px; font-weight: bold; color: #414141; }
h3 {  margin: 2px 0 15px 0; font-size: 16px; font-weight: bold; color: #0D7FC6;  }
h4 {}
h5 {}
ul, ol { margin: 0 0 14px 0; }
p, form { margin: 0 0 14px 0; }
p { margin: 0 0 2px; padding: 0; font-size: 13px; color: #666; line-height: 15px; }
a { color: #333334; text-decoration: none }
a:hover { color: #333334; text-decoration: underline }
a:visited { color: #333334 }
input, textarea, select { font-size: 11px; font-family: Arial, sans-serif; color: #4F535C; margin-left: 0 }
strong { font-weight: bold; color: #b63d94; }
em { font-style: italic; }
sup { font-size: 8px; vertical-align: super; }
sub { font-size: 8px; vertical-align: sub; }

.img_left { float: left; margin: 0 10px 10px 0; }
.img_right { float: right; margin: 0 0 10px 10px; }

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
/* Hide from IE Mac \*/
.clearfix { display: block; }
/* End hide from IE Mac */

.odd { background-color: #f0f0f0;	}
.hidden { display: none; }

.warning { clear: both; padding: 5px 10px; background: #fef9f9; border: 1px solid #f00; color: #f00; text-align: left; }
body p.notification { margin-left: 2px; margin-right: 2px }


/*-----------------------------------*/

p.notification { clear: both; margin: 5px 0 5px 0; padding: 10px 10px 10px 36px; border: 1px solid; background-position: 10px 11px !important; background-repeat: no-repeat !important; }
p.success { border-color: #9adf8f; background: #d5ffce url(../images/icon_tick_circle.png); color: #556652; }
p.error { border-color: #df8f8f; background: #ffcece url(../images/icon_cross_circle.png); color: #665252; }


/*-----------------------------------*/
.ui-datepicker-trigger { vertical-align: top; margin-top: 2px; margin-left: 4px; }


/* Page layout 
------------------------------------------------------------------*/
body > section { width: 1000px; margin: 0 auto; }
body > section > div { clear: both; margin: 10px 2px 0 2px  }


/* tree edit layout
------------------------------------------------------------------*/

#left_nav { width: 343px;  display: inline-block; margin-top: 7px }
#right_cont { display: inline-block; width: 645px; margin-top: 7px; vertical-align: top;
    box-shadow: 2px 2px 5px lightgrey; -moz-box-shadow: 2px 2px 5px lightgrey; -webkit-box-shadow: 2px 2px 5px lightgrey }

/* tree manager
------------------------------------------------------------------*/
#tree { background: white; border: solid 1px #CFCFCF; margin: 0px;
    box-shadow: 2px 2px 5px lightgrey; -moz-box-shadow: 2px 2px 5px lightgrey; -webkit-box-shadow: 2px 2px 5px lightgrey  }
body#images #tree, body#files #tree, body#forms #tree { margin-top: 10px }

#tree.jstree li.deleted a  { color: #BBB; }
#tree.jstree > ul { margin: 0 0 8px 5px }
#tree.jstree > ul > li { margin-top: 8px }
#tree.jstree li.invisible a  { color: #999; }
#tree.jstree a.jstree-clicked { background: #fcc14e }
#tree.jstree .jstree-hovered { background: #fee6b8; border: solid 1px #fee6b8 }
#tree.jstree a { height: 100%; width: 90%; border: solid 1px white }
#tree.jstree a.jstree-hovered { padding: 4px 2px 0 1px }
#tree.jstree li[rel=root] > a { font-size: 13px; color: #4d94cc; font-weight: bold }
#tree.jstree li[rel=root] > a.jstree-clicked { border: solid 1px #fcc14e }


/* item/page/content editor with "#right_cont"
------------------------------------------------------------------*/
label.kind { display: inline-block; width: 13px; height: 16px; text-align: center; vertical-align: top;
    border: 3px solid lightgrey; padding: 1px 4px 4px 6px;
    font-size: 16px; color: lightgrey; font-weight: bolder; }

#block_selector { }
#block_selector #stringlist { display: inline-block; margin: 22px 0px 0px 15px }
#block_selector #stringlist a {  margin: 0 }
#block_selector div { margin: 12px }
#block_selector img { vertical-align: top; }
#block_selector a {  color: #333334; font-weight: bolder; font-size: 13px;  display: inline-block; vertical-align: top; margin: 7px 0 0 12px }
#block_selector a:visited { color: #333334; }
#block_selector a:hover { color: #4d94cc; }

#template_selector { }
#template_selector label { margin: 0 32px 0 4px; color: #333334; font-weight: bolder; font-size: 13px }
#template_selector label:last-of-type { margin-right: 0 }
#template_selector h3 { margin-top: 20px }
#template_selector h3:first-child { margin-top: 10px }
#template_selector > div { margin: 5px 0 7px 0 }
#template_selector img { padding-top: 2px; vertical-align: top }
#template_selector article { display: inline-block; width: 230px; vertical-align: top }
#template_selector article a { margin: 5px 0px 0px 10px; color: #333334; font-weight: bolder; font-size: 13px; height: 19px; display: inline-block; vertical-align:top }
#template_selector article a:visited { color: #333334; }
#template_selector article a:hover { color: #4d94cc; }
#template_selector article span { display: block; margin: 0px 0 2px 10px; padding: 0; font-size: 12px; color: #666;}

#left_nav #ltabs { margin-top: 10px; padding: 0 }
#left_nav #ltabs .ui-widget-header { border: none; background: none; background-color: #F4F4F4 }
#left_nav #ltabs li.ui-state-default a, li.ui-state-default a:visited { color: #333334; cursor: pointer }
#left_nav #ltabs li.ui-state-active a, li.ui-state-active a:visited { color: #f3ad25; cursor: pointer }
#left_nav #ltabs li { border-color: #cccccc; }

#content_div { border: 1px solid #ccc; background-color: rgb(240, 240, 238);}
#content_div #content_buttons { margin: 5px; text-align: center; }
#content_div { border: 1px solid #ccc; background-color: rgb(240, 240, 238);}
#content_div textarea { width: 798px; }
#content_div tr.mceLast { display: none }


#content_data { background: white; border: solid 1px #cfcfcf; margin: 2px 0 0 2px }
#content_data form { }

#content_data section { margin: 10px; }
#content_data section > div { margin: 10px 5px 5px 8px; }
#content_data section button { margin-top: -1px; height: 25px }
#content_data > div { margin: 10px 5px 5px 8px; border: 1px solid #cfcfcf; }
#content_data input { font-size: 13px; line-height: 22px }
#content_data label { font-size: 13px; height: 19px; line-height: 22px; margin-bottom: 4px; color: #4d94cc; font-weight: bolder;  }
#content_data #preview { max-width: 440px; box-shadow: 4px 4px 7px lightgrey; border: solid 1px darkgrey;
    -moz-box-shadow: 4px 4px 7px lightgrey; -webkit-box-shadow: 4px 4px 7px lightgrey; }
#content_data label[for=title] { display: block; text-align: left; float: none; }

#content_data #tabs { margin: 5px 17px 5px 14px; border-radius: 0;  }
body#images #content_data #tabs,
body#files #content_data #tabs,
body#forms #content_data #tabs { margin-top: 16px }
#content_data #tabs > div { padding: 5px 5px 5px 5px; margin: 0px 0 0 2px; border: solid 1px #cfcfcf }
#content_data #tabs .ui-widget-header { border: none; background: none; background-color: #F4F4F4 }
#content_data #tabs.ui-widget-content { background: none; background-color: white }
#content_data #tabs li.ui-state-default a, li.ui-state-default a:visited { color: #333334 }
#content_data #tabs li.ui-state-active a, li.ui-state-active a:visited { color: #f3ad25 }
#content_data #tabs li { border-color: #cccccc; }

#content_data #content {}
#content_data #content #contentButtons { border: none; margin: 5px 0 5px 0; padding-left: 0px }
#content_data #content article { border: solid 1px #cfcfcf; margin: 5px 2px 18px 2px; padding: 5px; width: 575px; height: 68px;
    border-radius: 3px; -moz-border-radius: 5px; border-radius: 5px;
    box-shadow: 2px 2px 5px lightgrey; -moz-box-shadow: 2px 2px 5px lightgrey; -webkit-box-shadow: 2px 2px 5px lightgrey;
    background-color: white  }

#content_data #content h4 { margin: 10px 0 10px 3px; color: #4d94cc }
#content_data #content article > img { display: inline-block; box-shadow: 1px 1px 5px grey; margin: 16px 0 0 8px; vertical-align: top }
#content_data #content article > div.actions { display: inline-block; vertical-align:top; margin-top: 14px; float: right }
#content_data #content article > div.actions > span { display: inline-block; margin-left: 5px; font-size: 14px; line-height: 1.3;}



#content_data #content article > div > h5 { display: inline-block; width: 340px; margin: 2px 0 2px 8px; font-size: 12px }

#content_data #content article > div.input { vertical-align:top; display: inline-block; width: 410px }
#content_data #content article > div.input > textarea { display: inline-block; width: 400px; overflow: hidden; height: 30px; border-color: #cfcfcf; margin-left: 8px }
#content_data #content article > div.input > select { display: inline-block; margin: 20px 0 0 8px }

#content_data #content article > div.inputE { vertical-align:top; display: inline-block; width: 340px }
#content_data #content article > div.inputE > ul {  z-index: 999; position: relative }
#content_data #content article > div.inputE .ui-menu { width: 150px }
#content_data #content article > div.inputE > img { vertical-align: top; box-shadow: 1px 1px 5px grey; height: 50px; margin: 2px 0 0 8px; }
#content_data #content article > div.inputE > img.icon { box-shadow: none; height: 16px; margin: 20px 0 0 8px; }
#content_data #content article > div.inputE > span { margin: 22px 0 0 6px; overflow: hidden;  display: inline-block; width: 200px }
#content_data #content article > div.inputE > p { margin: 6px 0 0 8px; display: inline-block; width: 330px; overflow: hidden; height: 45px  }


#content_data #seo {  }
#content_data #seo div { margin: 10px 0 10px 4px }
#content_data #seo label { width: 80px; vertical-align: top; display: inline-block }
#content_data #seo input { width: 300px; vertical-align: top; display: inline-block }
#content_data #seo textarea { width: 390px; vertical-align: top; display: inline-block }
#content_data #seo span { font-size: 13px; margin-top: 5px; display: inline-block }

#content_data #options {  }
#content_data #options div { margin: 10px 0 10px 4px }
#content_data #options label { margin-left: 16px; width: 80px; vertical-align: top; display: inline-block; text-align: right }
#content_data #options label:first-child { margin: 0; width: 115px; text-align: left }
#content_data #options label[for=validto] { width: 18px }
#content_data #options input[type=text] { width: 300px; vertical-align: top; display: inline-block }
#content_data #options textarea { border: solid 1px #c0c0c0; width: 300px;  }
#content_data #options input[type=text].dater { width: 90px; }
#content_data #options input[type=checkbox] { margin-top: 0px }
#content_data #options span { font-size: 13px; margin-top: 5px; display: inline-block }
#content_data #options label { width: 80px; vertical-align: top; display: inline-block }
#content_data #options p { display: inline-block; }
#content_data #options .filelink { display: inline-block; vertical-align: top; margin-top: 5px }
#content_data #options div.radios { margin: 0; display: inline-block }
#content_data #options div.radios label { width: inherit; display: inline-block; margin: 0 20px 0 0 }
#content_data #options div.radios input[type=radio] { margin-top: 1px; }
#content_data #options div label.language { color: #f3ad25 }

#content_data #action_buttons { margin: 15px 17px 5px 15px }
#content_data #action_buttons span#last_modif { margin:10px 2px 0 0 ; float: right; display: inline-block }

#content_data #onepage #tabs #options #fileToUpload { margin-top: 6px }


/* back office tables + edit forms
------------------------------------------------------------------*/

#records { border-collapse:collapse; text-align: left; margin: 8px 0px 2px 0px; width: 100%;
    box-shadow: 2px 2px 5px lightgrey; -moz-box-shadow: 2px 2px 5px lightgrey; -webkit-box-shadow: 2px 2px 5px lightgrey }
#records th { background-color: #99defd; border: solid 1px #cfcfcf; padding: 6px; }
#records td { background-color: white; border: solid 1px #cfcfcf; padding: 6px 4px 10px 6px }
#records .right { text-align: right }
#records .center { text-align: center }
#records td a,
#records td a:visited { color: #333334; }
#records td a:hover { color: #4d94cc; }
#records td.edit span { background-position: -64px -112px; background-image: url(ui-lightness/images/ui-icons_ef8c08_256x240.png);
    width: 16px; height: 16px; display: inline-block; vertical-align: bottom; margin: 0px 4px -1px 0; }

#record { background-color: white; border: solid 1px #cfcfcf; padding: 8px;
    box-shadow: 2px 2px 5px lightgrey; -moz-box-shadow: 2px 2px 5px lightgrey; -webkit-box-shadow: 2px 2px 5px lightgrey }
#record label:first-child { width: 100px; margin-left: 0 }
#record label { width: 80px; vertical-align: top; display: inline-block; color: #4d94cc;
    font-weight: bolder; text-align: left; margin: 5px 0 0 20px }
#record label.choice { width: inherit; margin-left: 2px; margin-right: 10px; color: inherit; font-weight: normal }
#record textarea { width: 300px; height: 24px; vertical-align: top; display: inline-block; border-color: #cfcfcf  }
#record input[type=text] { width: 300px; vertical-align: top; display: inline-block }
#record input.number { width: 60px; }
#record input#domain { width: 100px }
#record select#domains { width: inherit }
#record fieldset > div { margin: 10px }
#record #action_buttons { margin: 15px 11px 0px 11px; border-top: solid 1px #cfcfcf; padding: 11px 0 6px 0;}

#record fieldset div > span { margin-top: 5px; margin-left: 3px; display: inline-block }

#record label.error { color: red; width: inherit }


/* Templates
------------------------------------------------------------------*/
#templates fieldset { vertical-align: top; display: inline-block }
#templates fieldset#left { width: 470px; border-right: solid 1px #cfcfcf; margin-right: 20px; }
#templates fieldset#right { width: 480px }
#templates fieldset#right > div.actions { margin: 15px 11px 0px 0px; border-top: solid 1px #cfcfcf; padding: 11px 0px 6px 0px }
#templates fieldset#right > div h4 { margin: 12px 0px 6px 0 }
#templates fieldset#right article * { vertical-align: top }
#templates fieldset#right article span.mover { display: inline-block; margin: 6px 0 0 5px; background-image: url(ui-lightness/images/ui-icons_ef8c08_256x240.png) }
#templates fieldset#right article input { margin: 6px 12px 0 6px; width: 270px }
#templates fieldset#right article img { margin-top: 2px }


/* Data from forms
------------------------------------------------------------------*/
#data table { width: 100% }
#data table th { font-weight: bold; text-align: left; padding: 6px 6px 4px 6px }
#data table td { font-weight: normal; text-align: left; padding: 4px 6px 4px 6px }
#data table tr:nth-child(even) { background-color: #e9e9e9 }
#data table tr:hover td { background-color: lightgrey; cursor: pointer; }
#data table td.date { width: 70px }
#data table td.status { width: 35px }

#data #record label { margin-top: 1px; }

#data form { margin: 0px; border: solid 1px #c0c0c0; padding: 10px }
#data form #action_buttons { border-top: solid 1px #c0c0c0; padding: 10px 0 0 156px; }
#data form #action_buttons button { margin-right: 10px }
#data form fieldset { border: none; padding: 0; margin: 0 }
#data form fieldset > div { margin: 10px 0 15px 0 }
#data form fieldset > div > label { display: inline-block; width: 160px; text-align: right; padding: 0 13px 0 0;
    font-weight: bold; vertical-align: top; line-height: 24px }
#data form fieldset > div > label.error { text-align: left; padding: 0 0 0 213px; color: red; display: block; width: inherit }
#data form fieldset > div > input.error,
#data form fieldset > div > textarea.error { border: 1px solid red }
#data form fieldset > div > input[type=text],
#data form fieldset > div > textarea { width: 400px }
#data form fieldset > div > input[type=text].number { width: 70px }
#data form fieldset > div > div { display: inline-block; }
#data form fieldset > div > div > label { display: inline-block; margin: 0 20px 0 7px;
    vertical-align: top; color: black; line-height: 24px }
#data form fieldset > div > div > input { vertical-align: baseline; }

#data form fieldset strong { color: black }
#data form fieldset div#info { margin-top: -10px }
#data form fieldset div#info div { padding-top: 6px }

/**********************JQuery-ui*********************/
.ui-corner-all, 
.ui-corner-bottom, 
.ui-corner-left, 
.ui-corner-bl { 
  -moz-border-radius-bottomleft: 4px; 
  -webkit-border-bottom-left-radius: 4px; 
  -khtml-border-bottom-left-radius: 4px; 
  border-bottom-left-radius: 4px; 
}
.ui-corner-all, 
.ui-corner-bottom, 
.ui-corner-right, 
.ui-corner-br { 
  -moz-border-radius-bottomright: 4px; 
  -webkit-border-bottom-right-radius: 4px; 
  -khtml-border-bottom-right-radius: 4px; 
  border-bottom-right-radius: 4px; 
}
